<template>
  <div>
    <el-dialog
      :title="title"
      :visible.sync="dialogFlag"
      class="avue-dialog avue-dialog--top"
      width="45%"
      @close="cancel"
    >
      <div style="margin: 10px 0;margin-right: 70px">
        <el-form ref="ruleForm" :model="dataForm" label-width="100px" class="product-form">
          <el-form-item label="处理人:" prop="handleUserName">
            <el-input v-model="dataForm.handleUserName" :readonly="true" size="small"></el-input>
          </el-form-item>
          <el-form-item label="处理时间:" prop="handleTime">
            <el-input v-model="dataForm.handleTime" :readonly="true" size="small"></el-input>
          </el-form-item>
          <el-form-item label="处理说明:" prop="remark">
            <vue-editor
              ref="editor"
              :editorOptions="editorOption"
              :disabled="true"
              v-model="dataForm.remark"
              style="width: 99%;"
            ></vue-editor>
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {detail} from "@/api/warning/warning-record"
import {getRole} from "@/api/system/role"
import {parseTime} from "@/utils/ruoyi";
import {VueEditor} from "vue2-editor";

export default {
  name: "recordLog",
  components: {
    VueEditor
  },
  data() {
    return {
      title: '处理日志',
      dialogFlag: false,
      dataForm: {},
      editorOption: {
        modules:{
          toolbar: [
            ['bold', 'italic', 'underline', 'strike', 'color', 'align', 'clean', 'image'],
          ]
        }
      }
    }
  },
  methods: {
    init(row) {
      this.dialogFlag = true;
      this.dataForm.id = row.id
      detail(row.id).then(res => {
        if (res.code === 0) {
          this.dataForm = res.data
          this.dataForm.handleTime = parseTime(res.data.handleTime)
          getRole(this.dataForm.handleUser).then(res => {
            this.$set(this.dataForm, 'handleUserName', res.data.name)
          })
        }
      })
    },
    cancel() {
      this.dialogFlag = false;
      this.dataForm = {};
      this.$refs['ruleForm'].clearValidate();
      this.$emit('restOnLoad');
    },
  }
}
</script>

<style scoped>
.product-form ::v-deep .el-form-item__label {
  color: #3f4448;
  font-weight: 400;
}

.product-form ::v-deep .el-textarea__inner {
  resize: none;
  min-height: 111.6px !important;
}
</style>
